<!-- 权限配置 -->
<template>
  <div>
    <a-row style="height:100%">
      <a-row class='mytitle'>
        <!-- <i class="icon icon-authority16f title-icon-style"></i> -->
        {{ $t('Auth-config') }}
      </a-row>

      <NoAuthPage v-showNoAuth="'G3-1'" />

      <a-row class="config-box" v-userAuth="'G3-1'">
        <!-- v-userAuth="'G3'" -->
        <div class="shadow-box">
          <a-col :span="4" style="height:100%">
            <div class="left-box">
              <div v-for="(item, index) in roleArray" :key="'main-role' + index">
                <div class="main-role">
                  <span>{{ $store.state.language == 'zh' ? item.ch_title : item.en_title }}</span>
                  <a-icon v-if="index == 1" v-userAuth="'G3-2'" type="plus-circle"
                    style="color:var(--themeColor);cursor:pointer" @click="createRole_dialog = true" />
                </div>
                <template v-if="item.children && index == 0">
                  <div class="sub-role" v-for="(item2, index2) in item.children" :key="'sub-role' + index2"
                    :class="currentIndex == index2 ? 'active-role' : ''" @click="selectRole(item2, index2)">
                    <span>{{ $store.state.language == 'zh' ? item2.ch_title : item2.en_title }}</span>
                  </div>
                </template>
                <template v-else-if="item.children && index == 1">
                  <div class="sub-role sub-role2" v-for="(item2, index2) in item.children" :key="'custom-role' + index2"
                    :class="currentIndex2 == index2 ? 'active-role' : ''" @click="selectCustomRole(item2, index2)">
                    <span>{{ item2.name }}</span>
                    <div class="sub-role-btn">
                      <!-- <i class="icon icon-edit16f role-operation-btn" @click="editRole(item2)" v-userAuth="'G3-3'"></i> -->
                      <Iconfont class="icon role-operation-btn" type="icon-edit16f" @click="editRole(item2)"
                        v-userAuth="'G3-3'"></Iconfont>
                      <!-- <i class="icon icon-delete16f role-operation-btn" @click="delCustomRole(item2)" v-userAuth="'G3-4'"></i> -->

                      <Iconfont class="icon role-operation-btn" type="icon-delete16f" @click="delCustomRole(item2)"
                        v-userAuth="'G3-4'"></Iconfont>
                    </div>
                  </div>
                </template>
              </div>
            </div>
          </a-col>
          <a-col :span="20">
            <div class="right-box">
              <!-- 权限配置标题 -->
              <div class="right-top-title">
                <span>{{ $t('Auth-config') }}</span>
                <!-- 保存配置 -->
                <a-button v-userAuth="'G3-5'" type="primary" @click="saveRoleConfig" :disabled="isDefaultRole"
                  :loading="saveConfigLoading">
                  {{ $t('Save-config') }}
                </a-button>
              </div>

              <!-- 展开/收起 -->
              <a-button type="primary" @click="expendFun" style="margin:15px 0">
                <!-- 展开所有 -->
                <!-- <i v-show="!isExpandAllRows" class="icon icon-unfold16f2 button-icon-style"></i> -->
                <Iconfont v-show="!isExpandAllRows" class="icon button-icon-style" type="icon-unfold16f2"></Iconfont>
                <span v-show="!isExpandAllRows">{{ $t('Expend-all') }}</span>
                <!-- 收起所有 -->
                <!-- <i v-show="isExpandAllRows" class="icon icon-packup16f1 button-icon-style"></i> -->
                <Iconfont v-show="isExpandAllRows" class="icon button-icon-style" type="icon-packup16f1"></Iconfont>
                <span v-show="isExpandAllRows">{{ $t('Stow-all') }}</span>
              </a-button>

              <!-- 权限表格 -->
              <div>
                <a-table :data-source="tableData" :columns="columns" size='small' bordered :rowKey="(record) => record.id"
                  :expandedRowKeys="expandedRowKeys" @expandedRowsChange="expandedRowsChange"
                  :defaultExpandAllRows="true">
                  <template slot="menu" slot-scope="text, record">
                    <span>{{ $store.state.language == 'zh' ? record.menuChTitle : record.menuEnTitle }}</span>
                  </template>
                  <!-- :disabled="isDefaultRole" -->
                  <div slot="authTitle">
                    <a-checkbox :indeterminate="isIndeterminate" v-model="checkAllAuth" @change="onCheckAllChange"
                      :disabled="isDefaultRole">
                      {{ $t('Permission') }}<!-- 权限 -->
                    </a-checkbox>
                  </div>
                  <template slot="auth" slot-scope="text, record">
                    <a-checkbox :indeterminate="record.indeterminate" :checked="record.checkPartAll"
                      @change="onCheckPartAllChange($event, record)" :disabled="isDefaultRole">
                      {{ $t('All') }}<!-- 全部 -->
                    </a-checkbox>
                    <!-- 二级页面的子项 -->
                    <!-- v-if="!record.children" -->
                    <a-checkbox-group v-model="record.checkedList" :options="record.menuOptions"
                      @change="onSingleChange(record)" :disabled="isDefaultRole">
                      <span slot="label" slot-scope="option">
                        {{ $store.state.language == 'zh' ? option.ch_label : option.en_label }}
                      </span>
                    </a-checkbox-group>
                  </template>
                </a-table>
              </div>
            </div>
          </a-col>
        </div>
      </a-row>
    </a-row>

    <!--新增角色-->
    <AddCustomRole v-if="createRole_dialog" :visible="createRole_dialog" @closeRoleDialog="closeRoleDialog"
      @updateCustomList="updateCustomList" />

    <!-- 编辑角色 -->
    <EditCustomRole v-if="editRole_dialog" :visible="editRole_dialog" :targetRole="targetRole"
      @closeRoleDialog="closeRoleDialog" @updateCustomList="updateCustomList" />
  </div>
</template>

<script>
import AddCustomRole from '@/views/authorityConfig/AddCustomRole'
import EditCustomRole from '@/views/authorityConfig/EditCustomRole'
import NoAuthPage from '@/components/common/NoAuthPage'

import request from '@/request/request'

export default {
  name: "AuthorityConfig",
  components: { AddCustomRole, EditCustomRole, NoAuthPage },
  data() {
    return {
      roleArray: [
        {
          ch_title: '默认角色',
          en_title: 'Default Role',
          children: [
            { ch_title: '超级管理员', en_title: 'Super administrator', id: 0 },
            { ch_title: '系统管理员', en_title: 'System administrator', id: 1 },
            { ch_title: '运维人员', en_title: 'DevOps personnel', id: 2 },
            { ch_title: '审计人员', en_title: 'Auditors', id: 3 },
          ]
        },
        {
          ch_title: '自定义角色',
          en_title: 'Custom Roles',
          children: [
            // { name:'aaa', id: 0 },
          ]
        }
      ],
      defaultRoleAuthObject: {},
      customRoleAuthObject: {},
      currentIndex: 0,
      currentIndex2: -1,
      isDefaultRole: true,
      columns: [
        { title: this.$t('Function-menu'), dataIndex: 'menuTitle', key: 'menuTitle', scopedSlots: { customRender: 'menu' }, width: 200 },
        { dataIndex: 'auth', key: 'auth', slots: { title: 'authTitle' }, scopedSlots: { customRender: 'auth' }, },
      ],
      tableData: [
        {
          menuChTitle: '顶部导航', menuEnTitle: 'Storage', id: 'A1', indeterminate: false, checkPartAll: true, children: [
            // {
            //   menuChTitle: '配置', menuEnTitle: 'Config', id: 'A2', indeterminate: false, checkPartAll: true, parentId: 'A1',
            //   children: [
            //     // {menuChTitle: '机器', menuEnTitle: 'Machine', id: 'A3', checkPartAll: true, indeterminate: false, parentId:'A2', checkedList:['A3-1'], menuOptions:[
            //     //   {ch_label: '查看', en_label:'View', value: 'A3-1'},
            //     // ]},
            //     // {menuChTitle: '磁盘', menuEnTitle: 'Disk', id: 'A4', checkPartAll: true, indeterminate: false, parentId:'A2', checkedList:['A4-1'], menuOptions:[
            //     //   {ch_label: '查看', en_label:'View', value: 'A4-1'},
            //     // ]},
            //     // {menuChTitle: '告警', menuEnTitle: 'Alarm', id: 'A5', checkPartAll: true, indeterminate: false, parentId:'A2', checkedList:['A5-1','A5-2','A5-3','A5-4','A5-5'], menuOptions:[
            //     //   {ch_label: '查看', en_label:'View', value: 'A5-1'},
            //     //   {ch_label: 'SMTP', en_label:'SMTP', value: 'A5-2'},
            //     //   {ch_label: '接收邮箱', en_label:'Receiving Mailbox', value: 'A5-3'},
            //     //   {ch_label: '企业微信', en_label:'Enterprise WeChat', value: 'A5-4'},
            //     //   {ch_label: '钉钉', en_label:'Ding Ding', value: 'A5-5'},
            //     // ]},
            //   ]
            // },
            {
              menuChTitle: '版权', menuEnTitle: 'Copyright', id: 'A6', checkPartAll: true, indeterminate: false, parentId: 'A1', checkedList: ['A6-2', 'A6-3'], menuOptions: [
                { ch_label: '升级', en_label: 'Upgrade', value: 'A6-2' },
                { ch_label: '授权权限管理', en_label: 'Authorization Management', value: 'A6-3' },
              ]
            }
          ]
        },
        // { menuChTitle: '概览', menuEnTitle:'Home', id:'B1', indeterminate: false, checkPartAll: true,checkedList:['B1-1'], menuOptions:[
        //   {ch_label: '查看', en_label:'View', value: 'B1-1'},
        // ]},
        {
          menuChTitle: '物理资源', menuEnTitle: 'Physical Resources', id: 'C1', indeterminate: false, checkPartAll: true,
          children: [
            {
              menuChTitle: '概况', menuEnTitle: 'Overview', id: 'C2', checkPartAll: true, indeterminate: false, parentId: 'C1', checkedList: ['C2-1'], menuOptions: [
                { ch_label: '查看', en_label: 'View', value: 'C2-1' },
              ]
            },
            {
              menuChTitle: '节点信息', menuEnTitle: 'Node Information', id: 'C3', checkPartAll: true, indeterminate: false, parentId: 'C1', checkedList: ['C3-1', 'C3-2'], menuOptions: [
                { ch_label: '查看', en_label: 'View', value: 'C3-1' },
                { ch_label: '点灯', en_label: 'Lighting', value: 'C3-2' },
              ]
            },
            {
              menuChTitle: '网络拓扑', menuEnTitle: 'Network Topology', id: 'C4', checkPartAll: true, indeterminate: false, parentId: 'C1', checkedList: ['C4-1'], menuOptions: [
                { ch_label: '查看', en_label: 'View', value: 'C4-1' },
              ]
            },
          ]
        },
        {
          menuChTitle: '存储管理', menuEnTitle: 'Storage', id: 'D1', indeterminate: false, checkPartAll: true,
          children: [
            {
              menuChTitle: '概况', menuEnTitle: 'Overview', id: 'D2', checkPartAll: true, indeterminate: false, parentId: 'D1', checkedList: ['D2-1', 'D2-2', 'D2-3', 'D2-4', 'D2-5', 'D2-6', 'E5-5'], menuOptions: [
                { ch_label: '查看', en_label: 'View', value: 'D2-1' },
                // {ch_label: '查看存储池', en_label:'Viewing Storage Pools', value: 'D2-2'},
                // {ch_label: '新增', en_label:'Add', value: 'D2-3'},
                // {ch_label: '编辑', en_label:'Edit', value: 'D2-4'},
                // {ch_label: '删除', en_label:'Delete', value: 'D2-5'},
                // {ch_label: '设置缓存池策略', en_label:'Set cache pool policy', value: 'D2-6'},
                // {ch_label: '置为未激活', en_label:'Set as inactive', value: 'E5-5'},
              ]
            },
            {
              menuChTitle: '存储池', menuEnTitle: 'Storage pool', id: 'D24', checkPartAll: true, indeterminate: false, parentId: 'D1', checkedList: ['D24-1', 'D24-2', 'D24-3', 'D24-4', 'D24-5', 'D24-6'], menuOptions: [
                { ch_label: '查看', en_label: 'View', value: 'D24-1' },
                { ch_label: '创建', en_label: 'Add', value: 'D24-2' },
                { ch_label: '编辑', en_label: 'Edit', value: 'D24-3' },
                { ch_label: '删除', en_label: 'Delete', value: 'D24-4' },
                { ch_label: '设置缓存池策略', en_label: 'Set cache pool policy', value: 'D24-5' },
                { ch_label: '设置压缩率', en_label: 'Set compression rate', value: 'D24-6' },
                // {ch_label: '置为未激活', en_label:'Set as inactive', value: 'E5-5'},
              ]
            },
            {
              menuChTitle: '块设备', menuEnTitle: 'Block device', id: 'D3', parentId: 'D1', checkPartAll: true, indeterminate: false,
              children: [
                {
                  menuChTitle: '概况', menuEnTitle: 'Block Device', id: 'D23', checkPartAll: true, indeterminate: false, parentId: 'D3', checkedList: ['D23-1', 'D23-2'], menuOptions: [
                    { ch_label: '查看', en_label: 'View', value: 'D23-1' },
                    { ch_label: '导出报表', en_label: 'Export Report', value: 'D23-2' },
                  ]
                },
                {
                  menuChTitle: '块设备', menuEnTitle: 'Block device', id: 'D4', checkPartAll: true, indeterminate: false, parentId: 'D3', checkedList: ['D4-1', 'D4-2', 'D4-3', 'D4-4', 'D4-5', 'D4-6', 'D4-7'], menuOptions: [
                    { ch_label: '查看', en_label: 'View', value: 'D4-1' },
                    { ch_label: '新增', en_label: 'Add', value: 'D4-2' },
                    { ch_label: '复制', en_label: 'Copy', value: 'D4-3' },
                    { ch_label: '分离', en_label: 'Separate', value: 'D4-4' },
                    { ch_label: '删除', en_label: 'Delete', value: 'D4-5' },
                    { ch_label: '放至回收站', en_label: 'Put it in the recycle bin', value: 'D4-6' },
                    { ch_label: '编辑', en_label: 'Edit', value: 'D4-7' },
                  ]
                },
                // {menuChTitle: 'iSCSI', menuEnTitle: 'iSCSI', id: 'D7', checkPartAll: true, indeterminate: false, parentId:'D3', checkedList:['D7-1','D7-2','D7-3','D7-4'], menuOptions:[
                //   {ch_label: '查看', en_label:'View', value: 'D7-1'},
                //   {ch_label: '客户端授权', en_label:'Client Authorization', value: 'D7-2'},
                //   {ch_label: '取消客户端授权', en_label:'Cancel Client Authorization', value: 'D7-3'},
                //   {ch_label: '修改客户端授权信息', en_label:'Modify client authorization information', value: 'D7-4'},
                //   // {ch_label: '分配lun', en_label:'Allocating lun', value: 'D6-5'},
                // ]},
                {
                  menuChTitle: '快照', menuEnTitle: 'Snapshot', id: 'D5', checkPartAll: true, indeterminate: false, parentId: 'D3', checkedList: ['D5-1', 'D5-2', 'D5-3', 'D5-4', 'D5-5', 'D5-6', 'D5-7', 'D5-8'], menuOptions: [
                    { ch_label: '查看', en_label: 'View', value: 'D5-1' },
                    { ch_label: '新增', en_label: 'Add', value: 'D5-2' },
                    { ch_label: '重命名', en_label: 'Rename', value: 'D5-3' },
                    { ch_label: '保护', en_label: 'Protect', value: 'D5-4' },
                    { ch_label: '解除保护', en_label: 'UnProtect', value: 'D5-5' },
                    { ch_label: '克隆至块设备', en_label: 'Clone to Block Device', value: 'D5-6' },
                    { ch_label: '回滚', en_label: 'Rollback', value: 'D5-7' },
                    { ch_label: '删除', en_label: 'Delete', value: 'D5-8' },
                  ]
                },
                {
                  menuChTitle: '回收站', menuEnTitle: 'Recycle bin', id: 'D6', checkPartAll: true, indeterminate: false, parentId: 'D3', checkedList: ['D6-1', 'D6-2', 'D6-3'], menuOptions: [
                    { ch_label: '查看', en_label: 'View', value: 'D6-1' },
                    { ch_label: '恢复', en_label: 'Recovery', value: 'D6-2' },
                    { ch_label: '删除', en_label: 'Delete', value: 'D6-3' },
                  ]
                },
                {
                  menuChTitle: 'iSCSI', menuEnTitle: 'iSCSI', id: 'D7', checkPartAll: true, indeterminate: false, parentId: 'D3', children: [
                    {
                      menuChTitle: '访问路径', menuEnTitle: 'User Group', id: 'D7-1', checkPartAll: true, indeterminate: false, checkedList: ['D7-1', 'D7-2', 'D7-3', 'D7-4'], menuOptions: [
                        { ch_label: '查看', en_label: 'View', value: 'D7-1' },
                        { ch_label: '新增', en_label: 'Create', value: 'D7-2' },
                        { ch_label: '编辑', en_label: 'Quota', value: 'D7-3' },
                        { ch_label: '删除', en_label: 'Delete', value: 'D7-4' },
                      ]
                    },
                    {
                      menuChTitle: '客户端组', menuEnTitle: 'Client', id: 'D22', checkPartAll: true, indeterminate: false, checkedList: ['D22-1', 'D22-2', 'D22-3', 'D22-4'], menuOptions: [
                        { ch_label: '查看', en_label: 'View', value: 'D22-1' },
                        { ch_label: '新增', en_label: 'Add', value: 'D22-2' },
                        { ch_label: '编辑', en_label: 'Edit', value: 'D22-3' },
                        { ch_label: '删除', en_label: 'Delete', value: 'D22-4' },
                        // {ch_label: '客户端授权', en_label:'Client Authorization', value: 'D7-2'},
                        // {ch_label: '取消客户端授权', en_label:'Cancel Client Authorization', value: 'D7-3'},
                        // {ch_label: '修改客户端授权信息', en_label:'Modify client authorization information', value: 'D7-4'},
                        // {ch_label: '拓扑图', en_label:'Topology Diagram', value: ''},//
                      ]
                    }
                  ]
                },
                {
                  menuChTitle: '优先级策略', menuEnTitle: 'Priority Policy', id: 'D8', checkPartAll: true, indeterminate: false, parentId: 'D3', checkedList: ['D8-1', 'D8-2', 'D8-3', 'D8-4', 'D8-5'], menuOptions: [
                    { ch_label: '查看', en_label: 'View', value: 'D8-1' },
                    { ch_label: '新增', en_label: 'Add', value: 'D8-2' },
                    { ch_label: '编辑', en_label: 'Edit', value: 'D8-3' },
                    { ch_label: '复制', en_label: 'Copy', value: 'D8-4' },
                    { ch_label: '删除', en_label: 'Delete', value: 'D8-5' },
                  ]
                },
              ]

              // checkedList:['3002_1','3002_2','3002_3','3002_4','3002_5'], menuOptions:[
              //   {ch_label: '块设备', en_label:'Block device', value: '3002_1'},
              //   {ch_label: 'iSCSI', en_label:'iSCSI', value: '3002_2'},
              //   {ch_label: '优先级策略', en_label:'Priority Policy', value: '3002_3'},
              //   {ch_label: '快照', en_label:'Snapshot', value: '3002_4'},
              //   {ch_label: '回收站', en_label:'Recycle bin', value: '3002_5'},
              // ],
            },
            {
              menuChTitle: '文件系统', menuEnTitle: 'File System', id: 'D9', parentId: 'D1', checkPartAll: true, indeterminate: false, children: [
                {
                  menuChTitle: '概况', menuEnTitle: 'Overview', id: 'D10', checkPartAll: true, indeterminate: false, parentId: 'D9', checkedList: ['D10-1', 'D10-2'], menuOptions: [
                    { ch_label: '查看', en_label: 'View', value: 'D10-1' },
                    { ch_label: '取消存储池关联', en_label: 'Disassociate Storage Pools', value: 'D10-2' },
                  ]
                },
                {
                  menuChTitle: '文件目录', menuEnTitle: 'File Sharing', id: 'D26', parentId: 'D1', checkPartAll: true, indeterminate: false, children: [
                    {
                      menuChTitle: '文件目录', menuEnTitle: 'File Sharing', id: 'D12', checkPartAll: true, indeterminate: false, parentId: 'D12', checkedList: ['D12-1', 'D12-2', 'D19-3', 'D25-3', 'D12-4', 'D13', 'D12-5'], menuOptions: [
                        { ch_label: '查看', en_label: 'View', value: 'D12-1' },
                        { ch_label: '创建', en_label: 'Create', value: 'D12-2' },
                        { ch_label: '创建共享', en_label: 'Create Share', value: 'D19-3' },
                        { ch_label: '创建配额', en_label: 'Create Quota', value: 'D25-2' },
                        { ch_label: '设置存储池', en_label: 'Set Storage Pool', value: 'D12-4' },
                        { ch_label: '快照配置', en_label: 'Snapshot configuration', value: 'D13' },
                        { ch_label: '删除', en_label: 'Delete', value: 'D12-5' },
                      ]
                    },
                    {
                      menuChTitle: '快照', menuEnTitle: 'Snapshot', id: 'D13', checkPartAll: true, indeterminate: false, parentId: 'D12', checkedList: ['D13-1', 'D13-2', 'D13-3', 'D13-4'], menuOptions: [
                        { ch_label: '查看', en_label: 'View', value: 'D13-1' },
                        { ch_label: '创建', en_label: 'Create', value: 'D13-2' },
                        { ch_label: '编辑', en_label: 'Edit', value: 'D13-3' },
                        { ch_label: '删除', en_label: 'Delete', value: 'D13-4' },
                      ]
                    },
                  ]
                },
                // {menuChTitle: '文件目录', menuEnTitle: 'File directory', id: 'D12', checkPartAll: true, indeterminate: false, parentId:'D9', checkedList:['D10-1','D10-2'], menuOptions:[
                //   {ch_label: '查看', en_label:'View', value: 'D12-1'},
                //   {ch_label: '创建共享', en_label:'Create Share', value: 'D19-2'},
                //   {ch_label: '创建配额', en_label:'Create Quota', value: 'D25-3'},
                //   {ch_label: '设置存储池', en_label:'Set Storage Pool', value: 'D12-4'},
                //   {ch_label: '快照配置', en_label:'Snapshot configuration', value: 'D13'},
                //   {ch_label: '删除', en_label:'Delete', value: 'D12-5'},
                // ]},
                {
                  menuChTitle: '文件用户', menuEnTitle: 'File User', id: 'D27', checkPartAll: true, indeterminate: false, parentId: 'D1', checkedList: ['D10-1', 'D10-2'], menuOptions: [
                    { ch_label: '查看', en_label: 'View', value: 'D27-1' },
                    { ch_label: '创建用户', en_label: 'Create Share', value: 'D27-2' },
                    { ch_label: '修改密码', en_label: 'Change password', value: 'D27-3' },
                    { ch_label: '删除', en_label: 'Delete', value: 'D27-4' },
                  ]
                },
                {
                  menuChTitle: '文件共享', menuEnTitle: 'File Sharing', id: 'D17', parentId: 'D1', checkPartAll: true, indeterminate: false, children: [
                    {
                      menuChTitle: 'NFS', menuEnTitle: 'NFS', id: 'D18', checkPartAll: true, indeterminate: false, parentId: 'D17', checkedList: ['D18-1', 'D18-2', 'D18-3', 'D18-4', 'D18-5', 'D18-6'], menuOptions: [
                        { ch_label: '查看', en_label: 'View', value: 'D18-1' },
                        { ch_label: '创建', en_label: 'Create', value: 'D18-2' },
                        { ch_label: '编辑', en_label: 'Edit', value: 'D18-3' },
                        { ch_label: '客户端操作', en_label: 'Client Operation', value: 'D18-4' },
                        { ch_label: '删除', en_label: 'Delete', value: 'D18-5' },
                      ]
                    },
                    {
                      menuChTitle: 'CIFS', menuEnTitle: 'CIFS', id: 'D19', checkPartAll: true, indeterminate: false, parentId: 'D17', checkedList: ['D19-1', 'D19-3'], menuOptions: [
                        { ch_label: '查看', en_label: 'View', value: 'D19-1' },
                        { ch_label: '管理', en_label: 'Manage', value: 'D19-3' },
                      ]
                    },
                  ]
                  //  checkedList:['3005_1','3005_2'], menuOptions: [
                  //   {ch_label: 'NFS', en_label:'NFS', value: '3005_1'},
                  //   {ch_label: 'CIFS', en_label:'CIFS', value: '3005_2'},
                  // ]

                },
                {menuChTitle: '配额管理', menuEnTitle: 'File User', id: 'D25', checkPartAll: true, indeterminate: false, parentId:'D1', checkedList:['D25-1','D25-2','D25-3','D25-4'], menuOptions:[
                  {ch_label: '查看目录配额', en_label:'View Directory Quotas', value: 'D25-1'},
                  {ch_label: '创建目录配额', en_label:'Create Directory Quotas', value: 'D25-2'},
                  {ch_label: '修改目录配额', en_label:'Edit Directory Quotas', value: 'D25-3'},
                  {ch_label: '删除目录配额', en_label:'Delete Directory Quotas', value: 'D25-4'},
                ]},
                // {menuChTitle: '存储管理', menuEnTitle: 'Storage Management', id: 'D11', checkPartAll: true, indeterminate: false, parentId:'D9', children: [
                //   {menuChTitle: '目录结构', menuEnTitle: 'Directory Structure', id: 'D12', checkPartAll: true, indeterminate: false, checkedList:['D12-1','D12-2','D12-3','D12-4','D12-5'], menuOptions:[
                //     {ch_label: '查看', en_label:'View', value: 'D12-1'},
                //     {ch_label: '创建', en_label:'Create', value: 'D12-2'},
                //     {ch_label: '配额', en_label:'Quota', value: 'D12-3'},
                //     {ch_label: '设置存储池', en_label:'Set Storage Pool', value: 'D12-4'},
                //     {ch_label: '删除', en_label:'Delete', value: 'D12-5'},
                //   ]},
                //   {menuChTitle: '快照', menuEnTitle: 'Snapshot', id: 'D13', checkPartAll: true, indeterminate: false, checkedList:['D13-1','D13-2','D13-3','D13-4'], menuOptions:[
                //     {ch_label: '查看', en_label:'View', value: 'D13-1'},
                //     {ch_label: '创建快照', en_label:'Create Snapshot', value: 'D13-2'},
                //     {ch_label: '回滚', en_label:'Rollback', value: 'D13-3'},
                //     // {ch_label: '部分回滚至', en_label:'Partial rollback to', value: 'D13-3'},
                //     // {ch_label: '完全回滚至', en_label:'Full rollback to', value: 'D13-4'},
                //     {ch_label: '删除快照', en_label:'Delete Snapshot', value: 'D13-4'},
                //   ]}
                // ]
                // }
              ]
              // checkedList:['3003_1','3003_2'], menuOptions:[
              //   {ch_label: '概况', en_label:'Overview', value: '3003_1'},
              //   {ch_label: '存储管理', en_label:'Storage', value: '3003_2'},
              // ],
            },
            {
              menuChTitle: '对象存储', menuEnTitle: 'Object storage', id: 'D14', parentId: 'D1', checkPartAll: true, indeterminate: false, children: [
                {
                  menuChTitle: '概况', menuEnTitle: 'Overview', id: 'D20', checkPartAll: true, indeterminate: false, parentId: 'D14', checkedList: ['D20-1', 'D20-2',], menuOptions: [
                    { ch_label: '查看', en_label: 'View', value: 'D20-1' },
                    { ch_label: '导出报表', en_label: 'Export Report', value: 'D20-2' },
                  ]
                },
                {
                  menuChTitle: '用户', menuEnTitle: 'User', id: 'D15', checkPartAll: true, indeterminate: false, parentId: 'D14', checkedList: ['D15-1', 'D15-2', 'D15-3', 'D15-4', 'D15-5', 'D15-6'], menuOptions: [
                    { ch_label: '查看', en_label: 'View', value: 'D15-1' },
                    { ch_label: '创建', en_label: 'Create', value: 'D15-2' },
                    { ch_label: '编辑', en_label: 'Edit', value: 'D15-3' },
                    { ch_label: '子用户操作', en_label: 'Sub User Action', value: 'D15-4' },
                    { ch_label: 'S3密钥操作', en_label: 'S3 Key Operation', value: 'D15-5' },
                    { ch_label: '删除', en_label: 'Delete', value: 'D15-6' },
                  ]
                },
                {
                  menuChTitle: '桶', menuEnTitle: 'Bucket', id: 'D16', checkPartAll: true, indeterminate: false, parentId: 'D14', checkedList: ['D16-1', 'D16-2', 'D16-3', 'D16-4'], menuOptions: [
                    { ch_label: '查看', en_label: 'View', value: 'D16-1' },
                    { ch_label: '创建', en_label: 'Create', value: 'D16-2' },
                    { ch_label: '编辑', en_label: 'Edit', value: 'D16-3' },
                    { ch_label: '删除', en_label: 'Delete', value: 'D16-4' },
                  ]
                },
                {
                  menuChTitle: '区域管理', menuEnTitle: 'Regional Management', id: 'D21', checkPartAll: true, indeterminate: false, parentId: 'D14', checkedList: ['D21-1', 'D21-2',], menuOptions: [
                    { ch_label: '查看', en_label: 'View', value: 'D21-1' },
                    { ch_label: '编辑区域', en_label: 'Edit Area', value: 'D21-2' },
                  ]
                },

                // checkedList:['3004_1','3004_2'], menuOptions:[
                //   {ch_label: '用户', en_label:'User', value: '3004_1'},
                //   {ch_label: '桶', en_label:'Bucket', value: '3004_2'},
                // ]
              ]
            },
            // {menuChTitle: '网关管理', menuEnTitle: 'Gateway Administration', id: Math.random()+'', checkPartAll: true, indeterminate: false, parentId:'D1', checkedList:['','','',''], menuOptions:[
            //   {ch_label: '查看', en_label:'View', value: ''},//
            //   {ch_label: '新增', en_label:'Add', value: ''},//
            //   {ch_label: '编辑', en_label:'Edit', value: ''},//
            //   {ch_label: '删除', en_label:'Delete', value: ''},//
            // ]
            // },
          ]
        },
        {
          menuChTitle: '运维中心', menuEnTitle: 'Operation', id: 'E1', indeterminate: false, checkPartAll: true,
          children: [
            // {menuChTitle: '集群检查', menuEnTitle: 'Cluster Check', id: 'E2', parentId:'E1', checkPartAll:true, indeterminate: false, children:[
            //   {menuChTitle: '节点服务检查', menuEnTitle: 'Node Service Check', id: 'E3', checkPartAll: true, indeterminate: false, parentId:'E2', checkedList:['E3-1','E3-2'], menuOptions:[
            //     {ch_label: '查看', en_label:'View', value: 'E3-1'},
            //     {ch_label: '扫描', en_label:'Scan', value: 'E3-2'},
            //   ]},
            //   {menuChTitle: '数据切片状态检查', menuEnTitle: 'Data slice status check', id: 'E4', checkPartAll: true, indeterminate: false, parentId:'E2', checkedList:['E4-1','E4-2'], menuOptions:[
            //     {ch_label: '查看', en_label:'View', value: 'E4-1'},
            //     {ch_label: '扫描', en_label:'Scan', value: 'E4-2'},
            //   ]},
            // ]

            // // checkedList:['4001_1','4001_2'], menuOptions: [
            // //   {ch_label: '节点服务检查', en_label:'Node service check', value: '4001_1'},
            // //   {ch_label: '数据切片状态检查', en_label:'Data slice status check', value: '4001_2'},
            // // ]
            // },
            {
              menuChTitle: 'OSD磁盘管理', menuEnTitle: 'OSD Disk Manage', id: 'E5', checkPartAll: true, indeterminate: false, parentId: 'E1', checkedList: ['E5-1', 'E5-2', 'E5-3', 'E5-4', 'E5-5', 'E5-6', 'E5-7', 'E5-8', 'E5-9'], menuOptions: [
                { ch_label: '查看', en_label: 'View', value: 'E5-1' },
                { ch_label: '清洗', en_label: 'clean', value: 'E5-2' },
                // {ch_label: '深层清洗', en_label:'Deep cleaning', value: 'E5-3'},
                { ch_label: '重设权重', en_label: 'Reset Weights', value: 'E5-3' },
                { ch_label: '销毁OSD', en_label: 'Destroy OSD', value: 'E5-4' },
                { ch_label: '移入集群', en_label: 'Move into cluster', value: 'E5-5' },
                { ch_label: '移出集群', en_label: 'Move out of cluster', value: 'E5-6' },
                { ch_label: '启用OSD', en_label: 'Enable OSD', value: 'E5-7' },
                { ch_label: '停用OSD', en_label: 'Disable OSD', value: 'E5-8' },
                { ch_label: '创建OSD磁盘', en_label: 'Create OSD Disk', value: 'E5-9' },
              ]
            },
            {
              menuChTitle: '集群调控', menuEnTitle: 'Cluster Regulation', id: 'E6', checkPartAll: true, indeterminate: false, parentId: 'E1', checkedList: ['E6-1', 'E6-2', 'E6-3'], menuOptions: [
                { ch_label: '查看', en_label: 'View', value: 'E6-1' },
                { ch_label: '数据一致性检查', en_label: 'Data consistency check', value: 'E6-2' },
                { ch_label: '恢复速率', en_label: 'Recovery Rate', value: 'E6-3' },
              ]
            },
            {
              menuChTitle: '纠删码配置管理', menuEnTitle: 'Erasure Code c/s', id: 'E7', checkPartAll: true, indeterminate: false, parentId: 'E1', checkedList: ['E7-1', 'E7-2', 'E7-3'], menuOptions: [
                { ch_label: '查看', en_label: 'View', value: 'E7-1' },
                { ch_label: '创建', en_label: 'Create', value: 'E7-2' },
                { ch_label: '删除', en_label: 'Delete', value: 'E7-3' },
              ]
            },
            {
              menuChTitle: '磁盘检测', menuEnTitle: 'Disk Detection', id: 'E8', checkPartAll: true, indeterminate: false, parentId: 'E1', checkedList: ['E8-1', 'E8-2', 'E8-3'], menuOptions: [
                { ch_label: '查看', en_label: 'View', value: 'E8-1' },
                { ch_label: '检测', en_label: 'Detection', value: 'E8-2' },
                { ch_label: '中断检测', en_label: 'Interrupt Detection', value: 'E8-3' },
                // { ch_label: '删除记录', en_label: 'Delete Record', value: 'E8-4' },
                // {ch_label: '快速检测', en_label:'Quick detection', value: 'E8-2'},
                // {ch_label: '深度检测', en_label:'Depth detection', value: 'E8-3'},
              ]
            },
            {
              menuChTitle: '日志管理', menuEnTitle: 'Log Management', id: 'E9', parentId: 'E1', checkPartAll: true, indeterminate: false, children: [
                {
                  menuChTitle: '操作日志', menuEnTitle: 'Operation Log', id: 'E11', checkPartAll: true, indeterminate: false, parentId: 'E9', checkedList: ['E11-1', 'E11-2'], menuOptions: [
                    { ch_label: '查看', en_label: 'View', value: 'E11-1' },
                    { ch_label: '下载', en_label: 'Download', value: 'E11-2' },
                  ]
                },
                {
                  menuChTitle: '系统日志', menuEnTitle: 'System Log', id: 'E10', checkPartAll: true, indeterminate: false, parentId: 'E9', checkedList: ['E10-1', 'E10-2', 'E10-3', 'E10-4', 'E10-5', 'E10-6'], menuOptions: [
                    { ch_label: '查看', en_label: 'View', value: 'E10-1' },
                    { ch_label: '规则设置', en_label: 'Rule Settings', value: 'E10-2' },
                    { ch_label: '收集', en_label: 'Collect', value: 'E10-3' },
                    { ch_label: '手工清除', en_label: 'Manual Clearing', value: 'E10-4' },
                    { ch_label: '下载', en_label: 'Download', value: 'E10-5' },
                    { ch_label: '一键备份', en_label: 'One click backup', value: 'E10-6' },
                  ]
                },
              ]
              // checkedList:['4006_1','4006_2'], menuOptions: [
              //   {ch_label: '操作日志', en_label:'Operation log', value: '4006_1'},
              //   {ch_label: '系统日志', en_label:'system log', value: '4006_2'},
              // ]
            },
          ]
        },
        {
          menuChTitle: '监控中心', menuEnTitle: 'Config', id: 'F1', indeterminate: false, checkPartAll: true,
          children: [
            {
              menuChTitle: '告警信息', menuEnTitle: 'Machine', id: 'F2', checkPartAll: true, indeterminate: false, parentId: 'F1', checkedList: ['F2-1', 'F2-2'], menuOptions: [
                { ch_label: '查看', en_label: 'View', value: 'F2-1' },
                { ch_label: '手动修复', en_label: 'Rule Settings', value: 'F2-2' },
              ]
            },
            {
              menuChTitle: '告警规则', menuEnTitle: 'Alarm rule', id: 'F3', checkPartAll: true, indeterminate: false, parentId: 'F1', checkedList: ['F3-1', 'F3-2'], menuOptions: [
                { ch_label: '查看', en_label: 'View', value: 'F3-1' },
                { ch_label: '编辑', en_label: 'Edit', value: 'F3-2' },
              ]
            },
            {
              menuChTitle: '告警配置', menuEnTitle: 'Alarm configuration', id: 'F4', checkPartAll: true, indeterminate: false, parentId: 'F1', checkedList: ['F4-1', 'F4-2'], menuOptions: [
                { ch_label: '查看', en_label: 'View', value: 'F4-1' },
                { ch_label: '编辑', en_label: 'Edit', value: 'F4-2' },
              ]
            },
          ]
        },
        {
          menuChTitle: '用户管理', menuEnTitle: 'User Management', id: 'G1', indeterminate: false, checkPartAll: true,
          children: [
            {
              menuChTitle: '用户', menuEnTitle: 'Machine', id: 'G2', checkPartAll: true, indeterminate: false, parentId: 'G1', checkedList: ['G2-1', 'G2-2', 'G2-3', 'G2-4', 'G2-5', 'G2-6', 'G2-7', 'G2-8', 'G2-9'], menuOptions: [
                { ch_label: '查看', en_label: 'View', value: 'G2-1' },
                { ch_label: '新增', en_label: 'Add', value: 'G2-2' },
                { ch_label: '编辑', en_label: 'Edit', value: 'G2-3' },
                { ch_label: '删除', en_label: 'Delete', value: 'G2-4' },
                { ch_label: '加锁', en_label: 'Lock', value: 'G2-5' },
                { ch_label: '解锁', en_label: 'Unlock', value: 'G2-6' },
                { ch_label: '冻结时长', en_label: 'Freeze duration', value: 'G2-7' },
                { ch_label: '查看黑名单', en_label: 'View Blacklist', value: 'G2-8' },
                { ch_label: '解锁黑名单', en_label: 'Unlock Blacklist', value: 'G2-9' },
              ]
            },
            {
              menuChTitle: '权限配置', menuEnTitle: 'Disk', id: 'G3', checkPartAll: true, indeterminate: false, parentId: 'G1', checkedList: ['G3-1', 'G3-2', 'G3-3', 'G3-4', 'G3-5'], menuOptions: [
                { ch_label: '查看', en_label: 'View', value: 'G3-1' },
                { ch_label: '新增', en_label: 'Add', value: 'G3-2' },
                { ch_label: '编辑', en_label: 'Edit', value: 'G3-3' },
                { ch_label: '删除', en_label: 'Delete', value: 'G3-4' },
                { ch_label: '保存配置', en_label: 'Save Configuration', value: 'G3-5' },
              ]
            },
            {
              menuChTitle: 'Oauth2身份认证', menuEnTitle: 'Disk', id: 'G6', checkPartAll: true, indeterminate: false, parentId: 'G1', checkedList: ['G6-1', 'G6-2', 'G6-3', 'G6-4', 'G6-5', 'G6-6'], menuOptions: [
                { ch_label: '查看', en_label: 'View', value: 'G6-1' },
                { ch_label: '创建', en_label: 'Create', value: 'G6-2' },
                { ch_label: '编辑', en_label: 'Edit', value: 'G6-3' },
                { ch_label: '删除', en_label: 'Delete', value: 'G6-4' },
                { ch_label: '开关', en_label: 'Switch', value: 'G6-5' },

              ]
            },
            {
              menuChTitle: '认证域管理', menuEnTitle: 'Disk', id: 'G5', checkPartAll: true, indeterminate: false, parentId: 'G5', checkedList: ['G5-1', 'G5-2', 'G5-3', 'G5-4', 'G5-5', 'G5-6'], menuOptions: [
                { ch_label: '查看', en_label: 'View', value: 'G5-1' },
                { ch_label: '添加', en_label: 'Append', value: 'G5-2' },
                { ch_label: '删除', en_label: 'Delete', value: 'G5-3' },
                { ch_label: '编辑', en_label: 'Edit', value: 'G5-4' },
                { ch_label: '域校验', en_label: 'Field Check', value: 'G5-5' },
                { ch_label: '用户同步', en_label: 'User synchronization', value: 'G5-6' },
              ]
            },
            // {
            //   menuChTitle: '黑名单', menuEnTitle: 'Blacklist', id: 'G4', checkPartAll: true, indeterminate: false, parentId: 'G1', checkedList: ['G4-1', 'G4-2'], menuOptions: [
            //     { ch_label: '查看', en_label: 'View', value: 'G4-1' },
            //     { ch_label: '解锁', en_label: 'Unlock', value: 'G4-2' },
            //   ]
            // },
          ]
        },
        {
          menuChTitle: '数据保护', menuEnTitle: 'Storage platform', id: 'H1', checkPartAll: true, indeterminate: false, parentId: 'H1', checkedList: ['H1-1', 'H1-2'], menuOptions: [
            { ch_label: '查看', en_label: 'View', value: 'H1-1' },
            { ch_label: '管理', en_label: 'Manage', value: 'H1-2' },
          ]
        },
        {
          menuChTitle: '系统设置', menuEnTitle: 'System settings', id: 'I1', indeterminate: false, checkPartAll: true,
          children: [
            {
              menuChTitle: '认证服务', menuEnTitle: 'Authentication Service', id: 'I2', checkPartAll: true, indeterminate: false, parentId: 'I1', checkedList: ['I2-1', 'I2-2', 'I2-3', 'I2-4'], menuOptions: [
                { ch_label: '查看', en_label: 'View', value: 'I2-1' },
                { ch_label: '创建', en_label: 'Create', value: 'I2-2' },
                { ch_label: '编辑', en_label: 'Edit', value: 'I2-3' },
                { ch_label: '删除', en_label: 'Delete', value: 'I2-4' },
              ]
            },
          ]
        }, 
      ],
      isIndeterminate: false,
      checkAllAuth: true,
      isExpandAllRows: true,
      expandedRowKeys: [],
      createRole_dialog: false,
      editRole_dialog: false,
      parentArr: [],
      checkedAuthArr: [],
      targetRole: {},
      saveConfigLoading: false,
      authArray: JSON.parse(localStorage.getItem('tags')),
      // checkPartAll: false,
      // indeterminate: false,
    }
  },

  mounted() {
    this.getRoleAndAuth();
    // this.filterCheckList(this.tableData, []);
  },

  watch: {
    //监听语言切换，切换data组件内的多语言
    getlanguage(val) {
      this.columns = [
        { title: this.$t('Function-menu'), dataIndex: 'menuTitle', key: 'menuTitle', scopedSlots: { customRender: 'menu' }, width: 200 },
        { dataIndex: 'auth', key: 'auth', slots: { title: 'authTitle' }, scopedSlots: { customRender: 'auth' }, },
      ];
    },
  },

  computed: {
    getlanguage() {
      return this.$store.state.language
    }
  },

  methods: {
    // 筛选列表数据（暂时不能通过角色的权限列表筛选，只能再让后端传一个所有角色该有的页面的权限id）
    filterCheckList(sourceData, finalData) {
      sourceData.forEach(item => {
        if (this.authArray.indexOf(item.id) != -1) {
          if (item.children) {
            finalData[finalData.length] = JSON.parse(JSON.stringify(item));
            finalData[finalData.length - 1].children = [];
            this.filterCheckList(item.children, finalData[finalData.length - 1].children);
          } else {
            finalData.push(item);
          }
        }
      })
      this.tableData = finalData;
    },

    //获取角色权限列表
    getRoleAndAuth() {
      request('get', 'usermanager/permission/').then(res => {
        // console.log('获取角色权限',res)
        if (res.data.flag == 1) {
          this.model(res.data.id) //返回模板
          this.notice(res.data.id, res.data.params, res.data.flag) //通知列表显示
        } else {
          let defaultRoleAuthObj = {};
          let customRoleAuthObj = {};
          let customRoleArr = [];
          for (let i = 0, length = res.data.length; i < length; i++) {
            //前4个是默认角色
            if (i <= 3) {
              defaultRoleAuthObj[res.data[i].id] = res.data[i].tags;
              defaultRoleAuthObj[res.data[i].id] = [...new Set(defaultRoleAuthObj[res.data[i].id])]
            } else {
              customRoleArr.push(res.data[i]);
              customRoleAuthObj[res.data[i].id] = res.data[i].tags;
              customRoleAuthObj[res.data[i].id] = [...new Set(customRoleAuthObj[res.data[i].id])]
            }
          }
          this.roleArray[1].children = customRoleArr;
          this.defaultRoleAuthObject = defaultRoleAuthObj;
          this.customRoleAuthObject = customRoleAuthObj;
          if (this.currentIndex != -1) {//当前选中的是默认角色
            if (this.targetRole.id) {//第一次渲染的时候没有targetRole
              this.byAuthIdGetData(this.tableData, this.defaultRoleAuthObject[this.targetRole.id]);
            } else {
              this.byAuthIdGetData(this.tableData, this.defaultRoleAuthObject['0']);
            }
          } else {//当前选中的是自定义角色
            this.byAuthIdGetData(this.tableData, this.customRoleAuthObject[this.targetRole.id]);
          }
          this.ChangeTableHeadStatus();
        }
      })
    },

    //遍历子项，确定一级目录的选择状态
    handleOneLevelStatus(parentItem) {
      let allNum = 0; //子项全选的数量
      let selectNum = 0; //模糊计算子项选中的数量
      parentItem.children.forEach((item, index) => {
        if (item.checkPartAll) {
          allNum++;
          selectNum++;
        } else if (item.indeterminate) {
          selectNum++;
        }
        if (index == parentItem.children.length - 1) {
          if (allNum == parentItem.children.length) {
            parentItem.indeterminate = false;
            parentItem.checkPartAll = true;
          } else if (selectNum > 0) {
            parentItem.indeterminate = true;
            parentItem.checkPartAll = false;
          } else {
            parentItem.indeterminate = false;
            parentItem.checkPartAll = false;
          }
        }
      })
    },

    //通过权限id数组，勾选权限
    byAuthIdGetData(arr, authArr) {
      arr.forEach(item => {
        // console.log('8888',item)
        if (item.children) {
          let checkArrNum = 0;
          this.byAuthIdGetData(item.children, authArr);
          this.handleOneLevelStatus(item);
          item.children.forEach((item2, index2) => {
            if (item2.children) {
              // console.log('1111111',item2)
              this.byAuthIdGetData(item2.children, authArr);
              this.handleOneLevelStatus(item2);
            } else if (!item2.children && !item2.menuOptions) {
              // console.log('222222', item2)
              if (authArr.indexOf(item2.id) != -1) {
                item2.checkPartAll = true;
                item2.indeterminate = false;
                checkArrNum++;
              } else {
                item2.checkPartAll = false;
                item2.indeterminate = false;
              }
              if (index2 == item.children.length - 1) {
                if (checkArrNum == item.children.length) {
                  item.indeterminate = false;
                  item.checkPartAll = true;
                } else if (checkArrNum > 0) {
                  item.indeterminate = true;
                  item.checkPartAll = false;
                } else {
                  item.indeterminate = false;
                  item.checkPartAll = false;
                }
              }
            }
            else {
              // this.byAuthIdGetData(item2, authArr);
              // console.log('33333', item2)
              let checkMenuNum = 0;
              item2.checkedList = [];
              item2.menuOptions.forEach((item3, index3) => {
                if (authArr.indexOf(item3.value) != -1) {
                  item2.checkedList.push(item3.value);
                  checkMenuNum++;
                }
                if (index3 == item2.menuOptions.length - 1) {
                  if (checkMenuNum == item2.menuOptions.length) {
                    item2.indeterminate = false;
                    item2.checkPartAll = true;
                  } else if (checkMenuNum > 0) {
                    item2.indeterminate = true;
                    item2.checkPartAll = false;
                  } else {
                    item2.indeterminate = false;
                    item2.checkPartAll = false;
                  }
                }
              })
            }
          })
        } else if (item.menuOptions) {
          // console.log('44444', item)
          let checkMenuNum = 0;
          item.checkedList = [];
          item.menuOptions.forEach((item2, index2) => {
            if (authArr.indexOf(item2.value) != -1) {
              item.checkedList.push(item2.value);
              checkMenuNum++;
            }
            if (index2 == item.menuOptions.length - 1) {
              if (checkMenuNum == item.menuOptions.length) {
                item.indeterminate = false;
                item.checkPartAll = true;
              } else if (checkMenuNum > 0) {
                item.indeterminate = true;
                item.checkPartAll = false;
              } else {
                item.indeterminate = false;
                item.checkPartAll = false;
              }
            }
          })
        } else {
          if (authArr.indexOf(item.id) != -1) {
            item.indeterminate = false;
            item.checkPartAll = true;
          } else {
            item.indeterminate = false;
            item.checkPartAll = false;
          }
        }
      })
    },

    //选择角色
    //0超级管理员 1系统管理员 2运维人员 3审计人员
    selectRole(item2, index2) {
      this.targetRole = item2;
      this.currentIndex2 = -1;
      this.isDefaultRole = true;
      this.currentIndex = index2;
      this.byAuthIdGetData(this.tableData, this.defaultRoleAuthObject[item2.id]);
      this.ChangeTableHeadStatus();
    },
    //选择自定义角色
    selectCustomRole(item2, index2) {
      this.targetRole = item2;
      this.currentIndex = -1;
      this.isDefaultRole = false;
      this.currentIndex2 = index2;
      this.byAuthIdGetData(this.tableData, this.customRoleAuthObject[item2.id]);
      this.ChangeTableHeadStatus();
    },

    //获取列表中所有勾选的权限
    getAllCheckedAuth(arr) {
      this.checkedAuthArr = [...new Set(this.checkedAuthArr)];
      arr.forEach(item => {
        if (item.checkPartAll || item.indeterminate) {
          this.checkedAuthArr.push(item.id)
        }
        if (item.children) {
          this.getAllCheckedAuth(item.children);
        }
        if (item.checkedList) {
          this.checkedAuthArr = this.checkedAuthArr.concat(item.checkedList);
        }
      })
    },
    //保存角色权限配置
    saveRoleConfig() {
      this.saveConfigLoading = true;
      this.checkedAuthArr = [];
      this.getAllCheckedAuth(this.tableData);
      // console.log('选中的权限',this.checkedAuthArr);
      request('put', 'usermanager/permission/', {
        id: this.targetRole.id,
        role_name: this.targetRole.name,
        tags: this.checkedAuthArr
      }).then(res => {
        // console.log('保存角色权限', res);
        this.getRoleAndAuth();
        this.model(res.data.id) //返回模板
        this.notice(res.data.id, res.data.params, res.data.flag) //通知列表显示
      }).catch(err => {

      }).finally(() => {
        this.saveConfigLoading = false;
      })
    },


    //表头的全选或不选--start
    //递归全选或不选，传入数组，属性，值
    allRecursion(arr, attr, value) {
      arr.forEach(item => {
        let checkedArr = [];
        item.indeterminate = false;
        item.checkPartAll = value;
        if (item[attr]) {
          this.allRecursion(item[attr], attr, value);
        }
        if (item.menuOptions) { //存在子项
          if (value) {
            item.menuOptions.forEach(item2 => {
              checkedArr.push(item2.value);
            })
            item.checkedList = checkedArr;
          } else {
            item.checkedList = [];
          }
        }
      })
    },
    //表头是否全选权限
    onCheckAllChange(e) {
      // Object.assign(this, {
      //   checkedList: e.target.checked ? plainOptions : [],
      //   indeterminate: false,
      //   checkAll: e.target.checked,
      // });
      if (e.target.checked) {
        this.isIndeterminate = false;
        this.checkAllAuth = true;
      } else {
        this.isIndeterminate = false;
        this.checkAllAuth = false;
      }
      this.handleAuthAllOrNone(e.target.checked);
    },
    //表头权限全选或不选
    handleAuthAllOrNone(value) {
      this.allRecursion(this.tableData, 'children', value);
    },
    //表头的全选或不选--end

    //递归展开所有行
    recursionExpend(arr, attr) {
      arr.forEach(item => {
        this.expandedRowKeys.push(item.id);
        if (item[attr]) {
          this.recursionExpend(item[attr], attr);
        }
      })
    },

    //是否展开所有行
    expendFun() {
      if (!this.isExpandAllRows) { //需要展开所有行
        this.recursionExpend(this.tableData, 'children');
        this.isExpandAllRows = true;
      } else { //收起所有行
        this.expandedRowKeys = [];
        this.isExpandAllRows = false;
      }
    },

    //单个checkbox变化
    onSingleChange(record) {
      // console.log('aaaa', record)
      record.indeterminate = !!record.checkedList.length && record.checkedList.length < record.menuOptions.length;
      record.checkPartAll = record.checkedList.length === record.menuOptions.length;
      //改变父节点的选择状态
      this.parentArr = [];
      this.getParentData(this.tableData, record.parentId);
      // this.handleOneLevelPageSelect();
      this.ChangeTableHeadStatus();
    },

    //循环遍历改变父节点的状态
    changeParentCheckStatus(parent, arr) {
      let selectChildNum = 0; //计算子类全选的个数
      let selectNum = 0; //模糊计算有选择的个数
      arr.forEach(item => {
        if (item.menuOptions) {
          if (item.checkedList.length == item.menuOptions.length) {
            selectChildNum++;
            selectNum++;
          } else if (item.checkedList.length > 0) {
            selectNum++;
          }
        } else {
          if (item.checkPartAll) {
            selectChildNum++;
            selectNum++;
          } else if (item.indeterminate) {
            selectNum++;
          }
        }
      })
      if (selectChildNum == arr.length) { //全选状态
        parent.indeterminate = false;
        parent.checkPartAll = true;
      } else if (selectNum > 0) { //半选
        parent.indeterminate = true;
        parent.checkPartAll = false;
      } else { //空
        parent.indeterminate = false;
        parent.checkPartAll = false;
      }
    },
    //获取父节点数组数据,并改变父节点状态
    //待优化，找到了父节点数组，但是之前的循环还在继续
    getParentData(arr, parentId) {
      arr.some(item => {
        if (item.id == parentId) {
          this.parentArr = item;
          // console.log('kkkkk',item)
          this.changeParentCheckStatus(item, item.children);
          if (item.parentId) {
            this.parentArr = [];
            this.getParentData(this.tableData, item.parentId);
          }
          return true;
        } else {
          if (item.children && this.parentArr.length == 0) {
            this.getParentData(item.children, parentId);
          }
        }
      })
      // return this.parentArr;
    },

    //单个菜单项的全选(全部按钮)
    onCheckPartAllChange(e, record) {
      // console.log('www',record)
      Object.assign(record, {
        checkedList: e.target.checked ? record.menuOptions : [],
        indeterminate: false,
        checkPartAll: e.target.checked,
      });
      if (record.children) {
        this.allRecursion(record.children, 'children', e.target.checked);
      } else {
        let checkedArr = [];
        if (e.target.checked) {
          if (record.menuOptions) {
            record.menuOptions.forEach(item => {
              checkedArr.push(item.value);
            })
            record.checkedList = checkedArr;
          }
        } else {
          record.checkedList = [];
        }
      }
      //改变父节点的选择状态
      this.parentArr = [];
      this.getParentData(this.tableData, record.parentId);
      // this.handleOneLevelPageSelect();
      this.ChangeTableHeadStatus();
    },

    //选择框选择后的变化，判断表头权限框的状态
    ChangeTableHeadStatus() {
      let allCheckedNum = 0; //所有一级页面全选数量
      let selectedNum = 0; //含糊计算选中的数量
      this.tableData.forEach(item => {
        if (item.checkPartAll) {
          allCheckedNum++;
        } else {
          if (item.children) {
            // indeterminate: false, checkPartAll: true,
            if (item.indeterminate|| item.checkPartAll) {
              selectedNum++;
            }
          }
        }
      })
      if (allCheckedNum == this.tableData.length) { //全选
        this.isIndeterminate = false;
        this.checkAllAuth = true;
      } else if (selectedNum > 0 || allCheckedNum > 0) { //半选
        this.isIndeterminate = true;
        this.checkAllAuth = false;
      } else { //空
        this.isIndeterminate = false;
        this.checkAllAuth = false;
      }
    },

    //展开行变化
    expandedRowsChange(expandedRowKeys) {
      this.expandedRowKeys = expandedRowKeys;
    },

    //删除自定义角色
    delCustomRole(item) {
      const _this = this;
      this.$confirm({
        title: this.$t('Del-Role'),
        content: this.$store.state.language == 'zh'
          ? `您确定要删除自定义角色${item.name}吗？`
          : `Are you sure you want to delete custom role ${item.name}?`,
        cancelText: this.$t('Cancel'),
        okText: this.$t('Sure'),
        okType: 'danger',
        onOk() {
          request('DELETE', 'usermanager/role/', {
            name: item.name,
            id: item.id
          }).then(res => {
            _this.getRoleAndAuth();
            _this.model(res.data.id) //返回模板
            _this.notice(res.data.id, res.data.params, res.data.flag) //通知列表显示
          }).catch(err => {

          })
        },
        onCancel() {
          return;
        },
      })
    },

    //编辑角色
    editRole(item) {
      this.targetRole = item;
      this.editRole_dialog = true;
    },

    //关闭角色操作弹窗
    closeRoleDialog(value) {
      if (value == 'add') {
        this.createRole_dialog = false;
      } else if (value == 'edit') {
        this.editRole_dialog = false;
      }
    },

    //更新角色列表
    updateCustomList() {
      this.getRoleAndAuth();
    },
  },
}
</script>
<style scoped>
.config-box {
  display: flex;
  padding: 15px;
}

.shadow-box {
  width: 100%;
  background-color: #fff;
  /* height: calc(100vh - 56px - 48px - 30px); 减去顶部导航栏、标题栏、padding边距 */
  box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.15);
}

.left-box {
  width: 100%;
  height: 100%;
  /* height: calc(100vh - 56px - 48px - 30px); 减去顶部导航栏、标题栏、padding边距 */
  /* padding: 15px; */
  background-color: #fff;
  border-right: 1px solid #ddd;
}

.main-role {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 15px 20px;
  font-weight: 700;
}

.sub-role {
  padding: 10px 30px;
  cursor: pointer;
}

.sub-role2 {
  display: flex;
  justify-content: space-between;
}

.sub-role-btn>span {
  margin-left: 8px;
}

.sub-role>span:nth-child(1):hover {
  color: var(--themeColor);
}

.active-role {
  color: var(--themeColor);
  background-color: #ebf1f5;
}

.right-box {
  width: 100%;
  padding: 10px 15px;
  background-color: #fff;
}

.right-top-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 16px;
}

.role-operation-btn {
  color: var(--themeColor);
  margin: 0 5px;
}

::v-deep.ant-table-pagination.ant-pagination {
  display: none;
}
</style>

    //拥有什么权限，checkbox显示什么状态
    showAuthState(authArr) {
      this.tableData.forEach(item => {
        if(authArr.indexOf(item.id) != -1) {
          if(item.children) {
            item.children.forEach((item2, index2) => {
              // let secondSelect = 0;
              // if(item2.menuOptions) {
              //   item2.menuOptions.forEach(item3 => {
              //     if(authArr.indexOf(item3.value) != -1) {

              //     }
              //   })
              // }else {//二级页面
              //   if(authArr.indexOf(item2.id) != -1) {
              //     item2.indeterminate = false;
              //     item2.checkPartAll = true;
              //     secondSelect++;
              //   }
              // }
              if(index2 == item.children.length-1) {
                if(secondSelect == item.children.length) {//全选
                  item.indeterminate = false;
                  item.checkPartAll = true;
                }else if(secondSelect > 0) {//半选
                  item.indeterminate = true;
                  item.checkPartAll = false;
                }else {//空
                  item.indeterminate = false;
                  item.checkPartAll = false;
                }
              }
            })
          }else {//一级页面
            item.indeterminate = false;
            item.checkPartAll = true;
          }
        }
      })

      // if(authArr) {
      let oneLevelFlagNum = 0;//一级页面全选的数量标志
      this.tableData.forEach(item => {
        //有一级页面的id
        if(authArr.indexOf(item.id) != -1) {
          //是否包含二级页面页面
          if(item.children) {
            //有二级页面及以上的是否全选标志
            let flagNum = 0;
            item.list = [];
            item.children.forEach((item2,index2) => {
              //含有该子页面id
              if(authArr.indexOf(item2.id) != -1) {
                item2.checkPartAll = true;
                flagNum++;
                item.list.push(item2.id);
                oneLevelFlagNum++;
                //是否包含三级页面
                if(item2.menuOptions) {
                  item2.checkedList = [];
                  item2.menuOptions.forEach((item3, index3) => {
                    //存在当前三级页面
                    if(authArr.indexOf(item3.value) != -1) {
                      item2.checkedList.push(item3.value);
                    }
                    //循环到最后一个
                    if(index3 == item2.menuOptions.length -1) {
                      //是否都包含三级页面
                      if(item2.checkedList.length == item2.menuOptions.length) {//全选
                        item2.checkPartAll = true;
                        item2.indeterminate = false;
                        flagNum++;
                      }else if(item2.checkedList.length > 0) {//半选情况
                        item2.checkPartAll = false;
                        item2.indeterminate = true;
                      }else {//空
                        item2.checkPartAll = false;
                        item2.indeterminate = false;
                      }
                    }
                  })
                }
              }else {
                item2.checkPartAll = false;
                //是否包含三级页面
                if(item2.menuOptions) {
                  item2.indeterminate = false;
                  item2.checkedList = [];
                }
              }
            })
            //一级页面全部选择框状态
            if(oneLevelFlagNum == item.children.length) {//全选
              item.checkPartAll = true;
              item.indeterminate = false;
            }else if(oneLevelFlagNum > 0) {//半选
              item.checkPartAll = false;
              item.indeterminate = true;
            }else {//空
              item.checkPartAll = false;
              item.indeterminate = false; 
            }
            //二级页面全部选择框状态
            if(flagNum == item.children.length) {//全选情况
              item.indeterminate = false;
              item.checkPartAll = true;
            }else if(flagNum > 0) {//半选
              item.indeterminate = true;
              item.checkPartAll = false;
            }else {
              item.indeterminate = false;
              item.checkPartAll = false;
            }
          }else {
            item.indeterminate = false;
            item.checkPartAll = true;
          }
        }
        //没有一级页面的id
        else {
          item.indeterminate = false;
          item.checkPartAll = false;
          //是否包含二级页面页面
          if(item.children) {
            item.list = [];
            item.children.forEach(item2 => {
              item2.indeterminate = false;
              item2.checkPartAll = false;
              if(item2.checkedList) {
                item2.checkedList = [];
              }
            })
          }
        }
      })
      //表头权限选择框状态
      if(oneLevelFlagNum == this.tableData.length) {//全选
        this.isIndeterminate = false;
        this.checkAllAuth = true;
      }else if(oneLevelFlagNum > 0) {//半选
        this.isIndeterminate = true;
        this.checkAllAuth = false;
      }else {//空
        this.isIndeterminate = false;
        this.checkAllAuth = false;
      }
      // }
    },

    //判断一级页面有没全选
    handleOneLevelPageSelect() {
      let flag = 0;
      let count = 0;
      this.tableData.forEach((item,index) => {
        // console.log('1111',item)
        if((item.checkPartAll && !item.indeterminate)) { //全选中的
          count++;
        }
        if(index == this.tableData.length-1) {
          if(count == index+1) { //全部都是选中的
            flag = 1;
          }else if(count == 0) { //一个都没选中
            flag = 0;
          }else { //部分选中
            flag = 2;
          }
        }
      })
      if(flag == 0) { //一个都没选中
        this.isIndeterminate = false;
        this.checkAllAuth = false;
      }else if(flag == 1) { //全部都是选中的
        this.isIndeterminate = false;
        this.checkAllAuth = true;
      }
      else if(flag == 2) { //部分选中
        this.isIndeterminate = true;
        this.checkAllAuth = false;
      }
    },